<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/warpper.css">
    <link rel="stylesheet" href="./css/header_footer.css">
</head>
<body>
    <!-- 顶部区域开始 -->
    <div class="top1">
        <div class="warpper clearfix">
            <p class="fl">legochina.cn</p>
            <span class="fr">
                欢迎光临
                <a href="#">乐购</a>,
                请 登陆\
                <a href="#">注册</a>
            </span>
        </div>
    </div>
    <!-- 顶部区域结束 -->

    <!-- 头部区域开始 -->
    <div class="header warpper clearfix">
        <div class="fl">
            <img src="./imgs/logo.jpg" alt="">
        </div>
        <div class="fr">
            <form action="#" class="search clearfix">
                    <input type="text" placeholder="拖鞋啊" >
                    <input type="button" class="input2">
                <a href="" class="_a1 fl">
                    <span></span>
                    购物车&nbsp;3
                </a>
                <a href="" class="_a2 fl">我的订单</a>
            </form>
            
        </div>
        <ul class="fr clearfix">
            <li>图书</li>
            <li>电子书</li>
            <li>原创文学</li>
            <li>服装</li>
            <li>运动户外</li>
            <li>孕婴童</li>
            <li>家居</li>
            <li>创意文具</li>
            <li>地方特产</li>
            <li>海外购</li>
            <li>电器城</li>
        </ul>
    </div>
    <!-- 头部区域结束 -->
    
    
    <div class="details-content clearfix">
        <!-- 左边 -->
        <div class="details-content-left fl">
            <div class="details-content-left-top"><img src="./imgs/书籍/23338636-1_l_5.jpg" alt=""></div>
            <div class="details-content-left-bom">
                <div class="clearfix">
                    <span class="fl"></span>
                    <img src="./imgs/书籍/22870923-1_l_1.jpg" alt="">
                    <img src="./imgs/书籍/22870923-1_l_1.jpg" alt="">
                    <span></span>
                </div>
                <p class="fs16">商品编号：11950959</p>
            </div>
        </div>
        <!-- 右边 -->
        <div class="details-content-right fl">
            <div class="details-content-right-top">
                <div class="box1">
                    <h5 class="fs22 fwn">她和他</h5>
                    <p class="f60_c fs18">
                        《偷影子的人》作者马克·李维重磅新作，法国连续60周在榜，销量突破120万册
                    </p>
                    <p class="fs16 c80">
                        [法] 马克·李维 著；杨亦雨 译
                    </p>
                </div>
                <div class="box2">
                    <div class="cx clearfix fs16">
                        <p class="fl">
                            乐 购 价：
                            <span class="f60_c fs22">
                                ￥26.20
                            </span>
                             [6.9折] [定价：￥38.00] (降价通知)
                        </p>
                        <p class="fr">
                            累计评价
                            <span class="f60_c">99999</span>
                        </p>
                    </div>
                    <p class="fs16 c6c">
                        促销信息：
                        <span class="f60_c">满减 每满150.00元，可减50.00元现金   </span>
                        详情 >>
                    </p>
                    <div class="lj">
                        <p class="fs16 c80">领 券：
                            <span>100-6</span>
                            <span>100-6</span>
                        </p>
                        
                    </div>
                </div>
                <div class="box3 fs16">
                    <p>
                        种类选择:
                        <span>平装版</span>
                        <span class="active">精装版</span>
                    </p>
                </div>
            </div>
            <div class="details-content-right-bom">
                <div class="clearfix">
                    <div class="shuliang fl clearfix fs16">
                        <p>1</p>
                        <span>+</span>
                        <span>-</span>
                    </div>
                    <div class="jiesuan fl f60_b">
                        加入购物车
                    </div>
                </div>
                <p class="fs16">温馨提示：支持7天无理由退货</p>
            </div>
        </div>
    </div>



    <!-- 页脚区域开始 -->
    <div class="footer">
        <div class="footer_top">
            <ul class="warpper clearfix">
                <li>
                    <img src="./imgs/222_11.png" alt="">
                </li>
                <li>
                    <img src="./imgs/222_13.png" alt="">
                </li>
                <li>
                    <img src="./imgs/222_15.png" alt="">
                </li>
                <li>
                    <img src="./imgs/222_17.png" alt="">
                </li>
            </ul>
        </div>
        <div class="footer_mid warpper clearfix">
            <ul class="ul1">
                <li>购物指南</li>
                <li>购物流程</li>
                <li>发票制度</li>
                <li>账户管理</li>
                <li>会员优惠</li>
            </ul>
            <ul>
                <li>支付方式</li>
                <li>货到付款</li>
                <li>网上支付</li>
                <li>礼品卡支付</li>
                <li>银行转帐</li>
            </ul>
            <ul>
                <li>订单服务</li>
                <li>订单配送查询</li>
                <li>订单状态说明</li>
                <li>自助取消订单</li>
                <li>自助修改订单</li>
            </ul>
            <ul>
                <li>退换货</li>
                <li>退换货政策</li>
                <li>自助申请退换货</li>
                <li>退换货进度查询</li>
                <li>退款方式和时间</li>
            </ul>
            <ul>
                <li>商家服务</li>
                <li>商家中心</li>
                <li>运营服务</li>
                <li>加入尾品汇</li>
            </ul>
            <img src="./imgs/logo_00.png" alt="">
        </div>
        <div class="footer_bom warpper">
            <p>
                公司简介 &emsp; | &emsp; Investor Relations  &emsp;| &emsp; 网站联盟  &emsp;|&emsp;  乐购招商  &emsp;|&emsp;  机构销售  &emsp;|&emsp;  手机乐购  &emsp;|&emsp;  官方Blog   &emsp;|&emsp;  热词搜索
            </p>
            <p>
                Copyright (C) 乐购网 2004-2016, All Rights Reserved
            </p>
        </div>
    </div>
    <!-- 页脚区域结束 -->
</body>
</html>